<template>
    <section>
         <el-row :gutter="20"> 
             <el-col  :md="24">
            <div class="grid-content bg-purple" :style="{backgroundColor:titleColor}"> 
            <div class="dev-title">组织详情</div>
            </div>
                <div style="padding:12px 15px;height: 300px;" class="col-bg clearfix">
                    <el-col :span="12">
                        <div class="device_img"> <img 
                                :src="imgUrl?imgUrl:require('../../../assets/1554284055.jpg')"></div>

                    </el-col>
                    <el-col :span="12">
                        <div class="device_p">
                            <div class="device_title">
                                <i class="ng-binding">{{detailList.name}}</i>
                                <i @click="companyedit()" title="编辑" icon="el-icon-edit" circle class="pb-icon icon-edit"></i>
                            </div>
                            <p class="ng-binding"><label class="ng-binding">电话号码：{{detailList.phone}}</label></p>
                            <p class="ng-binding"><label class="ng-binding">地址：{{detailList.address}}</label></p>
                            <p class="ng-binding"><label class="ng-binding">网址：{{detailList.site}}</label></p>
                            <!-- <p class="ng-binding"><label class="ng-binding">厂商：</label>{{facility.companyName}}</p> -->
                            <p class="ng-binding"><label class="ng-binding">备注:{{detailList.remark}}</label>
                            </p>
                            <!-- <p class="ng-binding"><label class="ng-binding">数据权限:{{detailList.dataRestrict}}</label>
                            </p> -->
                            <p class="ng-binding"><label class="ng-binding">过期时间:{{detailList.expirationTime}}</label>
                            </p>
                            <!-- <p class="ng-binding"><label class="ng-binding">在线状态：</label></p> -->
                            <!-- <p class="ng-binding"><label class="ng-binding">设备地址：</label>{{facility.deviceLocation.city}}</p> -->
                        </div>
                    </el-col>
                </div>
             </el-col>
             <el-col  :md="24">
                <h2 class="userlists">用户列表</h2>
               
                <el-table :data="userlist" highlight-current-row v-loading="listLoading" @selection-change="selsChange" :header-row-style="{backgroundColor: titleColor}" style="width: 100%;">
                        <!-- <el-table-column type="selection">
                        </el-table-column> -->
                        <el-table-column align="center" type="index" label="序号"  width="80" :index="indexMethod">
                        </el-table-column>
                        <el-table-column align="center" prop="userName" label="用户名">
                        </el-table-column>
                        <el-table-column align="center" prop="nickName" label="昵称">
                        </el-table-column>    
                        <el-table-column align="center" prop="createTime" label="注册时间">
                        </el-table-column>
                        <el-table-column align="center" prop="email" label="邮箱">
                        </el-table-column>
                        <el-table-column align="center" prop="phone" label="电话号码">
                        </el-table-column>
                        <el-table-column align="center" prop="company.name" label="所属组织">
                        </el-table-column>
                        <el-table-column align="center" prop="authTypeName" label="用户属性">
                        </el-table-column>                                                                                      
                        <el-table-column align="center" label="当前状态">
                            <template scope="scope">
                                <span v-if="scope.row.status==1">已停用</span>
                                <span v-if="scope.row.status==2">已启用</span>
                            </template>
                        </el-table-column>
                        <el-table-column align="center" label="状态操作">
                        <template scope="scope">
                            <el-button v-if="scope.row.status==2" size="small" @click="stateput( scope.row)"
                                type="small" plain>停用</el-button>
                            <el-button v-if="scope.row.status==1" size="small" :type="buttonColor"
                                @click="stateput( scope.row)" plain>启用</el-button>
                        </template>
                        </el-table-column>
                        <el-table-column align="center" v-if="custom_version!=1" label="登录地址">
                            <template scope="scope">
                                <div style="width:60px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis" :title="scope.row.address">{{scope.row.address}}</div>
                            </template>
                        </el-table-column>
                        <el-table-column align="center" label="角色">
                        <template scope="scope">
                            <el-button  size="small" @click="exentEdit(scope.$index, scope.row)">关联角色</el-button>
                        </template>
                        </el-table-column>
                        <el-table-column align="center" label="操作">
                            <template scope="scope">
                                <i @click="handleEdit(scope.$index, scope.row)"  title="编辑" icon="el-icon-edit" circle class="pb-icon icon-edit"></i>
                                <i @click="handleDel(scope.$index, scope.row)" v-show="scope.row.authType!=0" icon="el-icon-delete" circle title="删除" class="pb-icon icon-delete"></i>

                            </template>
                        </el-table-column>
                  </el-table>              
                   <!--工具条-->
                     <el-col :span="24" class="toolbar" style="margin:0;">
                    <el-pagination layout="prev, pager, next" @current-change="handleCurrentChange"   @size-change="handleSizeChange" :page-size="10" :total="total"
                        style="float:right;">
                        </el-pagination>
                    </el-col>
             </el-col>
            
            
         </el-row> 

          <!--编辑界面-->
        <el-dialog title="编辑" v-show="editFormVisible" v-model="editFormVisible" :custom-class="dialogTitleColor" @close="editFormVisible=false">
            <div slot="footer" style="text-align: left; ">
                <el-form :model="editForm" label-width="80px"  ref="editForm">
                    <el-form-item label="用户名" prop="">
                        <el-input v-model="editForm.userName" auto-complete="off"></el-input>
                    </el-form-item>
                    <el-form-item label="昵称" prop="">
                        <el-input v-model="editForm.nickName" auto-complete="off"></el-input>
                    </el-form-item>
                    <el-form-item label="邮箱" prop="">
                        <el-input v-model="editForm.email"  auto-complete="off"></el-input>
                    </el-form-item>
                    <el-form-item label="电话号码" prop="">
                        <el-input type="number" v-model="editForm.phone"></el-input>
                    </el-form-item>
                    <el-form-item label="重置密码">
                        <!-- <el-input v-model="passWord" :disabled="editForm.authType==3"></el-input> -->
                        <el-input v-model="passWord"></el-input>
                    </el-form-item>
                </el-form>
                <div slot="footer" class="dialog-footer" style="text-align:right;">
                    <!-- <el-button :type="buttonColor" @click.native="reset_passwords(editForm.childUserId)" :loading="editLoading">重置密码</el-button> -->
                    <el-button @click.native="editFormVisible = false">取消</el-button>
                    <el-button :type="buttonColor" @click.native="editSubmit(editForm.childUserId)" :loading="editLoading">提交</el-button>
                </div>
            </div>
        </el-dialog>
        <!-- 组织编辑 -->
        <el-dialog title="组织信息编辑" v-show="companyVisible" :custom-class="dialogTitleColor" @close="companyVisible = false">
            <div slot="footer" style="text-align: left; ">
                <el-form ref="form" :model="form" label-width="100px" >
                    <el-form-item label="组织名" prop="userName">
                        <el-input v-model="form.name" auto-complete="off"></el-input>
                    </el-form-item>
                    <el-form-item label="电话号码" prop="phone">
                        <el-input v-model="form.phone" auto-complete="off"></el-input>
                    </el-form-item>
                    <el-form-item label="上午上班时间">
                        <el-time-picker is-range v-model="morningtime" range-separator="至" value-format="HH:mm:ss" start-placeholder="上班时间" end-placeholder="下班时间" placeholder="选择时间范围"></el-time-picker>
                    </el-form-item>
                    <el-form-item label="下午上班时间">
                        <el-time-picker is-range v-model="afternoontime" range-separator="至" value-format="HH:mm:ss" start-placeholder="上班时间" end-placeholder="下班时间" placeholder="选择时间范围"></el-time-picker>
                    </el-form-item>
                    <!-- <el-form-item  label="角色权限">
                        
                            <el-button size="small" @click="exentEdit()">权限菜单</el-button>                                         
                       
                    </el-form-item> -->
                    <!-- <el-form-item label="过期时间">
                        <el-radio v-model="form.expirationStatus" :label="1" @change="second2()">永不过期</el-radio>
                        <el-radio v-model="form.expirationStatus" :label="0">选择日期</el-radio>
                        <el-date-picker v-show="form.expirationStatus == 0" v-model="value1" type="datetime" placeholder="选择日期时间" @change="second1()">
                            </el-date-picker>
                    </el-form-item> -->
                    <el-form-item label="网址">
                        <el-input v-model="form.site" auto-complete="off"></el-input>
                    </el-form-item>
                    <!-- <el-form-item label="等级选择">
                        <el-select v-model="form.dataRestrict" placeholder="请选择">
                            <el-option label="公开"  :value="0"></el-option>
                            <el-option label="一级"  :value="1"></el-option>
                            <el-option label="二级"  :value="2"></el-option>
                            <el-option label="三级"  :value="3"></el-option>
                            <el-option label="四级"  :value="4"></el-option>
                            <el-option label="五级"  :value="5"></el-option>
                            <el-option label="六级"  :value="6"></el-option>
                            <el-option label="七级"  :value="7"></el-option>
                            <el-option label="八级"  :value="8"></el-option>
                            <el-option label="九级"  :value="9"></el-option>
                            <el-option label="十级"  :value="10"></el-option>
                            <el-option label="不公开"  :value="11"></el-option>
                        </el-select>
                    </el-form-item> -->
                    <el-form-item label="备注" prop="remark">
                        <el-input type="textarea" v-model="form.remark"></el-input>
                    </el-form-item>
                    <el-form-item label="图片">
                    <el-upload class="avatar-uploader" :headers="fileList" action="/api/auth/image_file/upload"
                        :show-file-list="false" :on-success="handleAvatarSuccess" :before-upload="beforeAvatarUpload">
                        <img v-if="form.logo" :src="form.logo" class="avatar">
                        <i v-else class="el-icon-plus avatar-uploader-icon"></i>
                    </el-upload>
                    </el-form-item>
                    <el-form-item label="地址">
                        <div id="editmap" ref="editmap"></div>
                        <div style="position: absolute;right: 28%;top: 1%;">
                            <el-button :type="buttonColor" size="mini" @click="drawRange">设置围栏</el-button>
                        </div>
                        <div style="font-size: 12px;color: #a7a7a7;width: 820px;">
                            <div style="display: flex;">
                                <span>选择围栏颜色：</span>
                                <span class="colorsel" v-for="item in colorlist" :key="item.id" :style="{background: item.color}" @click="changeColor(item.color)"></span>
                            </div>
                            <div>
                                提示：点击“设置围栏”后在地图上点击选择范围，双击鼠标左键结束设置
                            </div>
                        </div>
                        <div class="map_position clearfix ng-binding" style="width: 790px;margin: 0;">
                            <el-input type="text" id="suggestId" placeholder="请输入公司地址" v-model="form.address" class="input_style"></el-input>
                            <!-- 经度：{{form.longitude}},纬度：{{form.latitude}} -->
                        </div>
                    </el-form-item>
                </el-form>
            </div>
            <div slot="footer" class="dialog-footer">
                <el-button @click.native="companyVisible = false">取消</el-button>
                <el-button :type="buttonColor" @click.native="companySubmit" :loading="editLoading">提交</el-button>
            </div>
        </el-dialog>

        <!--权限编辑界面-->
        <el-dialog title="权限编辑" v-show="editexentble" :custom-class="dialogTitleColor" @close="editexentble = false">
            <div slot="footer" style="text-align: left; ">

                <el-transfer v-model="editrole.roleList" :titles="['未选中', '选中']" :data="userlists" style="margin-left:30px;padding-bottom:20px;"></el-transfer>

            </div>
            <div slot="footer" class="dialog-footer">
                <el-button @click.native="editexentble = false">取消</el-button>
                <el-button :type="buttonColor" @click.native="editSubmitrole" :loading="editLoading">提交</el-button>
            </div>
        </el-dialog>
        <!-- 验证码界面 -->
        <el-dialog title="删除" v-show="delVisible" v-model="delVisible" :custom-class="dialogTitleColor" @close="delVisible=false">
            <div slot="footer" style="text-align: left; ">
                <el-form @submit.native.prevent :model="verifyCode" label-width="100px" :rules="codeRules" ref="addForm">
                    <el-form-item prop="code" label="验证码">
                        <el-input v-model="verifyCode.code" auto-complete="off"></el-input>
                    </el-form-item>


                </el-form>
                <div slot="footer" class="dialog-footer" style="text-align: right;">

                    <el-button type="success" @click.native="codeadd">获取验证码</el-button>
                    <el-button @click.native="delVisible = false">取消</el-button>
                    <el-button :type="buttonColor" @click.native="delclick" :loading="addLoading">提交</el-button>
                </div>
            </div>
        </el-dialog>
    </section>
</template>

<script>
import {
        company_get,
        user_query,
        user_edit_child,
        user_get_childr,
        user_delete_child,
        user_reset_child_pass,
        query_user, 
        user_role_query_child_user,
        user_edit_child_role,
        company_put,
        company_post,
        send_auth_pass_code,
        user_disable,
        user_enable
    } from '../../../api/api';
export default{
    data(){
        const generateDatas = _ => {
                const data = [];
                let para = {
                    pageNo: 1,
                    pageSize: 1000
                };
                //NProgress.start();
                query_user(para).then((res) => {
                     this.begCode(res.code,res.message);
                    // this.total = res.data.totalCount;
                    if (res.code == 0) {
                        for (let i in res.data.list) {
                            data.push({
                                key: res.data.list[i].id,
                                label: res.data.list[i].name
                            });
                        }
                    } else {
                        this.$router.push({
                            path: '/login'
                        });
                    }
                    //NProgress.done();
                });
                return data;
            };
            const defaultWorktime = ()=>{
                let date = new Date()
                let hour = date.getHours()
                let min = date.getMinutes()
                let second = date.getSeconds()
                return hour +':' + min + ':'+ second
            };
        return{
            custom_version: this.CustomVersion(),//为0正常公有云，为1私有化定制
            value1:new Date(),
            fileList: {
                    token: JSON.parse(localStorage.getItem('key'))
                },
            delVisible:false,
            editexentble:false,
            companyVisible:false,
            addLoading:false,
            total:0,
            verifyCode:{
                code:'',
            },
            codeRules:{
                code:[{
                    required: true,
                    message: '请填写验证码',
                    trigger: 'blur'
                }],
            },
            detailList:{
                name:'',
                phone:'',
                address:'',
                site:'',
                remark:'',
                dataRestrict:'', 
                expirationTime:''
            },//组织信息
            imgUrl:'',//展示组织logo
            page:1,
            // type:"",
            companyId:'',//组织id
            userlist:[],
            listLoading: false,//加载中
            editFormVisible:false,//展示编辑框
            editLoading:false,
            passWord:'',//密码
            editForm:{
                childUserId:'',
                userName:'',
                nickName:'',
                email:'',
                phone:'',
                dataRestrict:''
            },//编辑界面数据
            form: {
                expirationStatus:'',//是否会过期, 1永不过期，0会过期。
                expirationTime:'',//过期时间
                logo:'',
                name: '',
                remark: '',
                site: '',
                phone: '',
                longitude: '',
                latitude: '',
                address: '',
                companyUserId: '',
                dataRestrict:[],
            },
            editrole: {
                childUserId: '',
                roleList: [],
            },
            userlists: generateDatas(),
            userId:'',
            pointMap:'',//地图实例对象
            styleOptions: {
                strokeColor: "red",    //边线颜色。
                fillColor: "red",      //填充颜色。当参数为空时，圆形将没有填充效果。
                strokeWeight: 3,       //边线的宽度，以像素为单位。
                strokeOpacity: 0.2,    //边线透明度，取值范围0 - 1。
                fillOpacity: 0.1,      //填充的透明度，取值范围0 - 1。
                strokeStyle: 'solid' //边线的样式，solid或dashed。
            },
            colorlist:[{
                    id: 1,
                    color: "#1af3fa"
                },{
                    id: 2,
                    color: "#1afa29"
                },{
                    id: 3,
                    color: "#eb910e"
                },{
                    id: 4,
                    color: "#ffd000"
                },{
                    id: 5,
                    color: "#eccc68"
                },{
                    id: 6,
                    color: "#ff7f50"
                },{
                    id: 7,
                    color: "#ff6b81"
                },{
                    id: 8,
                    color: "#ffa502"
                },{
                    id: 9,
                    color: "#ff6348"
                },{
                    id: 10,
                    color: "#ff4757"
                },{
                    id: 11,
                    color: "#7bed9f"
                },{
                    id: 12,
                    color: "#70a1ff"
                },{
                    id: 13,
                    color: "#5352ed"
                },{
                    id: 14,
                    color: "#2ed573"
                },{
                    id: 15,
                    color: "#1e90ff"
                },{
                    id: 16,
                    color: "#3742fa"
                }],
            morningtime: [defaultWorktime(),defaultWorktime()],//上午上班时间
            afternoontime: [defaultWorktime(),defaultWorktime()],//下午上班时间
            workrange:[],//电子围栏经纬度点数组
            drawingManager:''
        }
    },
    computed:{
            buttonColor(){
                return this.$store.state.buttonColor
            },
            titleColor(){
                return this.$store.state.titleColor
            },
            dialogTitleColor(){
                return this.$store.state.dialogTitleColor
            },
        },
    methods:{
        // 切换围栏颜色
        changeColor(color){
                console.log(this.morningtime)
                console.log(this.afternoontime)
                this.styleOptions.strokeColor = color
                this.styleOptions.fillColor = color
            },
        map() {
                var th = this;
                let self = this;
                let longitude = 114.753297;//河源
                let latitude = 23.795719;
                this.pointMap = new BMap.Map(this.$refs.editmap);
                // 创建Map实例
                // map.centerAndZoom(new BMap.Point(116.404, 39.915), 5);

                // var poi = new BMap.Point(this.form.longitude, this.form.latitude);
                var poi = new BMap.Point(longitude,latitude);
                this.pointMap.addControl(new BMap.NavigationControl());
                this.pointMap.enableScrollWheelZoom(poi, 5);
                let pt1 = new BMap.Point(
                    this.form.longitude,
                    this.form.latitude
                );
                let rangePointlist = []//接口拉的多边形点数组
                if(this.workrange.length>0){
                    for(let i in this.workrange){
                        rangePointlist.push(new BMap.Point(this.workrange[i].lng,this.workrange[i].lat))
                    }
                }
                var polygon = new BMap.Polygon(rangePointlist, this.styleOptions);  //创建多边形
                let marker1 = new BMap.Marker(pt1);
                this.pointMap.addOverlay(marker1);
                this.pointMap.addOverlay(polygon);
                this.pointMap.centerAndZoom(poi, 15);
               
                    
                //实例化鼠标绘制工具
                let that = this            
                this.drawingManager = new BMapLib.DrawingManager(this.pointMap, {
                    isOpen: false, //是否开启绘制模式
                    // enableDrawingTool: false, //是否显示工具栏
                    drawingToolOptions: {
                        anchor: BMAP_ANCHOR_TOP_RIGHT, //位置
                        offset: new BMap.Size(5, 5), //偏离值
                    },
                    polygonOptions: that.styleOptions, //多边形的样式
                });
                //添加鼠标绘制工具监听事件，用于获取绘制结果
                var overlaycomplete = function (e) {
                    console.log(e)
                    console.log(e.overlay.Mo)
                    console.log(e.overlay.Mo[0].lat)
                    let pointlist = e.overlay.Mo
                    for(let i in pointlist){
                        that.workrange.push(pointlist[i])
                    }
                    console.log(that.workrange);
                    // overlays.push(e.overlay);
                    that.drawingManager.close();
                    // console.log(this.drawingManager.getDrawingMode())
                };
                this.drawingManager.addEventListener('overlaycomplete', overlaycomplete);


                // var ac = new BMap.Autocomplete( //建立一个自动完成的对象
                //     {
                //         "input": "editId",
                //         "location": this.pointMap
                //     })
                // var myValue
                // ac.addEventListener("onconfirm", function (e) { //鼠标点击下拉列表后的事件
                //     var _value = e.item.value;
                //     myValue = _value.province + _value.city + _value.district + _value.street + _value.business;
                //     self.address_detail = myValue;
                //     self.form.address = myValue;
                //     setPlace();
                // });

                // function setPlace() {
                //     this.pointMap.clearOverlays(); //清除地图上所有覆盖物
                //     function myFun() {
                //         th.userlocation = local.getResults().getPoi(0).point; //获取第一个智能搜索的结果
                //         this.pointMap.centerAndZoom(th.userlocation, 18);
                //         this.pointMap.addOverlay(new BMap.Marker(th.userlocation)); //添加标注

                //         self.form.longitude = th.userlocation.lng;
                //         self.form.latitude = th.userlocation.lat;
                //         console.log(th.userlocation)
                //     }
                //     var local = new BMap.LocalSearch(this.pointMap, { //智能搜索
                //         onSearchComplete: myFun
                //     });
                //     local.search(myValue);

                //     //测试输出坐标（指的是输入框最后确定地点的经纬度）
                //     this.pointMap.addEventListener("click", function (e) {
                //         //经度
                //         console.log(th.userlocation.lng);
                //         //维度
                //         console.log(th.userlocation.lat);

                //     })
                // }
                // // this.pointMap.addEventListener("mousemove", function (e) {
                // //     console.log(e.point)
                // // });
                // this.pointMap.addEventListener("click", function (e) {
                //     this.pointMap.clearOverlays()
                //     //    alert(JSON.stringify(e.point))
                //     let pt = new BMap.Point(
                //         e.point.lng,
                //         e.point.lat
                //     );
                //     self.form.longitude = e.point.lng;
                //     self.form.latitude = e.point.lat;
                //     let marker = new BMap.Marker(pt);
                //     this.pointMap.addOverlay(marker);
                //     var geoc = new BMap.Geocoder();
                //     let addComp, address;
                //     geoc.getLocation(e.point, function (rs) {
                //         addComp = rs.addressComponents;

                //         self.form.province = addComp.province;
                //         self.form.city = addComp.city;
                //         self.form.county = addComp.district;
                //         address = addComp.province + addComp.city + addComp.district + addComp.street +
                //             addComp.streetNumber;

                //         self.form.address = address;

                //     });



                // });
            },
            //开启地图画范围的功能
            drawRange(type) {
                this.workrange = []
                this.pointMap.clearOverlays()
                this.drawingManager.open();
                this.drawingManager.setDrawingMode(BMAP_DRAWING_POLYGON);
            },
            //上传照片
        handleAvatarSuccess(res, file) {
            console.log(file.type);
            this.form.logo = res.data.path;
            // this.form.devicePictureList[0].path = res.data.path;
        },
        beforeAvatarUpload(file) {
            const isJPG = file.type === 'image/jpeg';
            const isPNG = file.type === 'image/png';
            const isGIF = file.type === 'image/gif';
            let tp = false;
            if (isJPG) {
                tp = isJPG;
            } else if (isPNG) {
                tp = isPNG
            } else if (isGIF) {
                tp = isGIF
            } else {

            }
            const isLt2M = file.size / 1024 / 1024 < 1;
            if (!isJPG && !isPNG && !isGIF) {
                this.$message.error('上传头像图片只能是 JPG,GIF,PNG 格式!');
            }
            if (!isLt2M) {
                this.$message.error('上传头像图片大小不能超过 1MB!');
            }
            return tp && isLt2M;
            },
            exentEdit: function (index, row) {
                this.editrole.roleList=[];
                this.editexentble = true;
                console.log(row)
                let para1 = {
                    childUserId:''
                }
                if(row){                  
                    para1.childUserId = row.userId
                }else{                    
                    para1.childUserId = this.form.id  
                 
                }
                console.log(para1)
                user_role_query_child_user(para1).then((res) => {
                    console.log(res)
                     this.begCode(res.code,res.message);
                    if(row){                  
                       this.editrole.childUserId = row.userId;
                    }else{                    
                        this.editrole.childUserId = this.form.id;
                    }
                    for (let i in res.data.list) {
                        this.editrole.roleList.push(res.data.list[i].id);
                    }
                    // console.log(res)
                })
            },
            getdata(date) {

				var y = date.getFullYear();
				var m = date.getMonth() + 1;
				m = m < 10 ? ('0' + m) : m;
				var d = date.getDate();
				d = d < 10 ? ('0' + d) : d;
				var h = date.getHours();
				h = h < 10 ? ('0' + h) : h;
				var minute = date.getMinutes();
				minute = minute < 10 ? ('0' + minute) : minute;
				var second = date.getSeconds();
				second = second < 10 ? ('0' + second) : second;
				return y + '-' + m + '-' + d + ' ' + h + ':' + minute + ':' + second;

			},
             second2(){
                  this.form.expirationTime = ""
            },
            second1(){
                this.form.expirationTime = this.getdata(this.value1)
                console.log(this.form.expirationTime)
                console.log(this.form.expirationStatus)
            },
            indexMethod(index) {
                let num = (this.page - 1) * 10 + index + 1;
                return num;
            },
            getCompany(){
             let para = {
                    companyId: sessionStorage.getItem('company_detail')
                };
            company_get(para).then((res) => {
                this.form = res.data;
                this.detailList.name = res.data.name
                this.detailList.phone = res.data.phone
                this.detailList.address = res.data.address
                this.detailList.site = res.data.site
                this.detailList.remark = res.data.remark
                this.detailList.expirationTime = res.data.expirationTime
                
                if(res.data.dataRestrict!=0 && res.data.dataRestrict!=11){
                    this.detailList.dataRestrict = res.data.dataRestrict + "级"
                }
                 if(res.data.dataRestrict == 0){
                    this.detailList.dataRestrict= "公开"
                }
                 if(res.data.dataRestrict == 11){
                    this.detailList.dataRestrict= "不公开"
                }
                if(!this.form.expirationTime){
                    this.detailList.expirationTime = "永不过期"
                }
                this.imgUrl = res.data.logo              
                
                this.companyId = res.data.companyId 
                if(this.form.attr1){
                    let time = JSON.parse(this.form.attr1)
                    this.morningtime = time.moriningWorkTime
                    this.afternoontime = time.afternoonWorkTime
                }
                if(this.form.attr3){
                    let point = JSON.parse(this.form.attr3)
                    this.workrange = point[0].range
                    this.styleOptions = point[0].styleOptions
                    this.styleOptions.strokeOpacity = '0.2'
                    this.styleOptions.fillOpacity = '0.1'
                }
                this.getUsers()
                
                // console.log(res.data)
            })
        },
        //编辑
            editSubmitrole: function () {
                this.$confirm('确认提交吗？', '提示', {}).then(() => {
                    this.editLoading = true;
                    //NProgress.start();
                    let para = this.editrole;
                    // console.log(para)
                    user_edit_child_role(para).then((res) => {
                         this.begCode(res.code,res.message);
                        if (res.code == 0) {
                            this.editLoading = false;
                            //NProgress.done();
                            this.$message({
                                message: '提交成功',
                                type: 'success'
                            });
                            this.$refs['editForm'].resetFields();

                            this.editexentble = false;
                            this.getUsers();

                        }
                    });
                });
            },
        handleEdit:function(index,row) {
            this.editFormVisible = true
            console.log(row)
            let para = {
                childUserId:row.userId
            }
            user_get_childr(para).then((res) => {
                this.begCode (res.code);
                if (res.code == 0) {
                    this.editForm = {
                        childUserId:res.data.userId,
                        userName:res.data.userName,
                        nickName:res.data.nickName,
                        email:res.data.email,
                        phone:res.data.phone,
                        dataRestrict: res.data.dataRestrict
                        }
                }
               
                // console.log(this.editForm)
            })
        },
        handleDel:function(index,row) {
            // console.log(row)
            this.delVisible = true;
            this.userId = row.userId
            // this.$confirm('确认删除吗?', '提示', {
            //         type: 'warning'
            //     }).then(() => {
            //         this.listLoading = true;
                   
            //         let para = {
            //             childUserId: row.userId
            //         };
            //     //    console.log(row)
            //        console.log(para)
            //        user_delete_child(para).then((res) => {
            //            this.listLoading = false;
            //            this.$message({
            //                     message: '删除成功',
            //                     type: 'success'
            //                 });
            //             this.getUsers();
            //        })
            //     }).catch(() => {

            //     });
        },//删除

        editSubmit: function(s) {
            this.listLoading = true
            this.editLoading = true;
            let para = this.editForm
            user_edit_child(para).then((res) => {
                this.listLoading = false
                this.editLoading = false;
                this.begCode(res.code, res.message);
                 if (res.code == 0) {
                        if(this.passWord != ""){
                            this.reset_passwords(s)
                        }else{
                            this.$message({
                                message: '提交成功',
                                type: 'success'
                            });
                            this.$refs['editForm'].resetFields();
                            this.editFormVisible = false;                        
                        this.getUsers();
                        }
                    } else {
                        this.$message({
                            message: res.message,
                            type: 'warning'
                        });
                                }
                // console.log(res)
            })

        },
        companyedit() {
                this.companyVisible = true;
                this.getCompany()
                setTimeout(() => {
                    this.map()
                }, 500);
                if(this.detailList.expirationTime != '永不过期'){
                    this.value1 = this.detailList.expirationTime
                }
            },

        reset_passwords(s) {
             this.$confirm('确认重置密码吗?', '提示', {
                    type: 'warning'
                }).then(() => {
                    //NProgress.start();
                    if (this.passWord.length < 6) {
                        this.$message({
                            message: '修改的密码最小为6位',
                            type: 'warning'
                        });
                        return false;
                    }
                    this.editLoading = true;
                    let para = {
                        childUserId: s,
                        passWord: this.passWord
                    };
                    console.log(para)
                    user_reset_child_pass(para).then((res) => {
                        // console.log(res)
                         this.begCode(res.code,res.message);
                        if (res.code == 0) {
                            this.listLoading = false;
                            //NProgress.done();
                            this.$message({
                                message: '重置密码成功',
                                type: 'success'
                            });

                            this.editFormVisible = false;
                            this.editLoading = false;
                            this.getUsers();

                        }
                    });
                }).catch(() => {

                });
        },
         getUsers() {
                let para = {
                    pageNo: this.page,
                    pageSize: 10,                  
                    companyId: this.companyId,
                    dataRestrict:this.dataRestrict
                };
                // console.log(para)
                //NProgress.start();
                user_query(para).then((res) => {
                    this.begCode(res.code,res.message);
                   this.userlist = res.data.list
                   this.pageNo = res.data.pageNo;
                    this.total = res.data.totalCount;
                //    for (let i in this.userlist){
                //        if(this.userlist[i].authType == 0){
                //            this.userlist[i].authType = '管理员'
                //        }
                //        if(this.userlist[i].authType == 1){
                //            this.userlist[i].authType = '员工'
                //        }
                //        if(this.userlist[i].authType == 2){
                //            this.userlist[i].authType = '维修员'
                //        }
                //        if(this.userlist[i].authType == 3){
                //            this.userlist[i].authType = '消费端用户'
                //        }
                //    }
                   console.log(res)
                });
                
            },
            companySubmit() {
                let worktime = {moriningWorkTime: this.morningtime,afternoonWorkTime: this.afternoontime}
                this.form.attr1 = JSON.stringify(worktime)
                let pointRange = [{range:this.workrange,styleOptions: this.styleOptions}]
                this.form.attr3 = JSON.stringify(pointRange)
                let para = this.form;
                console.log(this.form)
                // return false;
                if (this.form.id) {
                    company_put(para).then((res) => {
                         this.begCode(res.code,res.message);
                        this.companyVisible = false;
                        this.getUsers();
                        this.$message({
                            message: '修改成功',
                            type: 'success'
                        });
                        this.getCompany()
                    });
                } else {
                    company_post(para).then((res) => {
                         this.begCode(res.code,res.message);
                        this.companyVisible = false;
                        this.getUsers();
                        this.$message({
                            message: '添加成功',
                            type: 'success'
                        });
                        this.getCompany()
                    });
                }
            },
        selsChange: function (sels) {
            this.sels = sels;
        },
        codeadd() {
                       
                send_auth_pass_code().then((res) => {

                    this.begCode(res.code, res.message);
                    //NProgress.done();
                    if (res.code == 0) {
                        this.$message({
                            message: '发送成功,请耐心等待',
                            type: 'success'
                        });
                    }

                });
            },
            //删除
            delclick(){
                    
                    if(!this.verifyCode.code){
                        this.$message({
                                message: '请输入验证码',
                                type: 'warning'
                            });
                            return false;
                    }
                    let para = {
                        childUserId: this.userId,
                        verifyCode:this.verifyCode.code
                    };

                    user_delete_child(para).then((res) => {
                        this.begCode(res.code,res.message);
                        if (res.code == 0) {

                            this.delVisible = false;
                            this.verifyCode='';
                            //NProgress.done();
                            this.$message({
                                message: '删除成功',
                                type: 'success'
                            });

                            this.getUsers();

                        }
                    });
            },
            // 角色启用禁用
             stateput(s) {
                let para = {
                    idList: [s.userId]
                }
                if (s.status == 1) {
                    user_enable(para).then((res) => {
                         this.begCode(res.code,res.message);
                        if (res.code == 0) {
                            this.$message({
                                message: '启用成功',
                                type: 'success'
                            });
                            this.getUsers();
                        }
                    });
                } else {
                    user_disable(para).then((res) => {
                         this.begCode(res.code,res.message);
                        if (res.code == 0) {
                            //NProgress.done();
                            this.$message({
                                message: '停用成功',
                                type: 'success'
                            });
                            this.getUsers();
                        }
                    });
                }
            },
            handleCurrentChange(val) {
                this.page = val;
                this.getUsers()
            },
            handleSizeChange(val) {
                this.pageSize = val;
                this.getUsers()
            },
    },
    mounted(){
        this.getCompany()  
    }
}
</script>

<style>
    #editmap{
        /* height: 300px; */
        height: 500px;
        width: 820px;
    }
    .tangram-suggestion-main {
        z-index: 9999999999;
    }
    .avatar-uploader .el-upload {
        border: 1px dashed #d9d9d9;
        border-radius: 6px;
        cursor: pointer;
        position: relative;
        overflow: hidden;
    }

    .avatar-uploader .el-upload:hover {
        border-color: #409EFF;
    }

    .avatar-uploader-icon {
        font-size: 28px;
        color: #8c939d;
        width: 178px;
        height: 178px;
        line-height: 178px;
        text-align: center;
    }
    .avatar {
        width: 178px;
        height: 178px;
        display: block;
    }
    .device_title{
        border-bottom: 1px solid #ccc;
        margin-bottom: 5px;
    }
    .device_title .ng-binding{
        font-weight: bold;
        font-size: 20px;
    }
    .device_img{
        width: 300px;
        height: 300px;
        margin: 0 auto;
    }
    .device_img img{
        max-width: 100%;
        max-height: 100%;  
    } 
    /* .userlists{
        font-weight: bold;
    } */
    .userlists{
        font-size: 20px;
        font-weight: bold;
        padding-left: 10px;
    }
    .colorsel{
        display: inline-block;
        width: 20px;
        height: 20px;
        /* background-color: red; */
        /* margin-top: 10px; */
        margin: 10px 2px;
        cursor: pointer;
        border-radius: 5px;
    }
</style>